import React, { useEffect } from 'react'
import { Table, Space } from 'antd'
const MyTable = () => {
  useEffect(() => {
    console.log('init')
  }, [])
  console.log('render')
  const dataSource = [
    {
      id: 1,
      name: 'z',
      age: 18,
      address: 'sy'
    },
    {
      id: 2,
      name: 'f',
      age: 17,
      address: 'sy'
    }
  ]
  const columns = [
    {
      title: '姓名',
      dataIndex: 'name',
      render: text => <a>{text}</a>
    },
    {
      title: '年龄',
      dataIndex: 'age'
    },
    {
      title: '地址',
      dataIndex: 'address'
    },
    {
      title: '操作',
      render: (text, record) => (
        <Space size='middle'>
          <a>修改</a>
          <a>删除</a>
        </Space>
      )
    }
  ]
  return (
    <>
      <div className='box'>
        <div className='box-header'>base</div>
        <div className='box-body'>
          <div className='box-content'>
            <Table rowKey='id' dataSource={dataSource} columns={columns}></Table>
          </div>
        </div>
      </div>
    </>
  )
}
export default MyTable